<template>
  <div>
    <!--步骤条-->
    <el-steps :active="1">
      <el-step title="选择商品分类" description="选择商品分类"></el-step>
      <el-step title="填写商品信息" description="填写商品信息"></el-step>
      <el-step title="填写商品属性" description="填写商品属性"></el-step>
    </el-steps>

    <!--联动下拉框-->
    <el-select v-model="value1" multiple placeholder="请选择">
      <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
    </el-select>

    <el-select v-model="value2" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择">
      <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
    </el-select>

    <el-select v-model="value3" multiple collapse-tags style="margin-left: 20px;" placeholder="请选择">
      <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
    </el-select>
  </div>
</template>

<script>
export default {
  data () {
    return {
      options1: [{
        value: '选项1',
        label: '黄金糕'
      }],
      options2: [{
        value: '选项1',
        label: '黄金糕'
      }],
      options3: [{
        value: '选项1',
        label: '黄金糕'
      }],
      value1: [],
      value2: [],
      value3: [],
      parentId: 0
    }
  },
  methods: {},
  async created () {
    const { data: res } = await this.$http.post(`goods/spec/selectParentId`, this.searchMap)
    console.log(res)
  }
}
</script>

<style  scoped>
</style>
